<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Welcome to awdplaform</title>
    <link type="text/css" rel="stylesheet" href="static/css/bootstrap.min.css">
    <link type="text/css" rel="stylesheet" href="static/js/jquery.validate/jquery.validate.css">
    <script src="static/js/jquery.min.js"></script>
    <script src="static/js/bootstrap.min.js"></script>
    <script src="static/js/jquery.validate/jquery.validate.min.js"></script>
</head>
<body>

<div class="container">
    <div class="jumbotron">
        <h1>Register</h1>
        <p>Welcome to awdplaform</p>
    </div>
    <form action={{url_for("register")}} method="POST">
        <p style="color:red;">{{error}}</p>
        <div class="form-group">
            <label for="InputUser">User Name</label>
            <input type="text" class="form-control" name="username" id="username" placeholder="username">
        </div>
        <div class="form-group">
            <label for="InputPassword">Password</label>
            <input type="password" class="form-control"  name="password" id="password" placeholder="password">
        </div>
        <div class="form-group">
            <label for="InputTeamname">TeamName</label>
            <input type="text" class="form-control"  name="teamname" id="teamname" placeholder="teamname">
        </div>
        <button type="submit" class="btn btn-default">Register</button>
        <button type="button" onclick="location.replace('/login')" class="btn btn-link">LOGIN</button>
    </form>
    </div>
    <script>
        $( "form" ).validate({
        rules: {
            username: {
                 required: true,
               },
            password: {
                 required: true,
               },
            }
       });
                return isSuccess;
            }, "UserName already exists.");
    </script>
</body>
</html>